<HTML>
 <HEAD>
  <TITLE> ZTREE DEMO </TITLE>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <link rel="stylesheet" href="ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
  <style>
	body {
	background-color: white;
	margin:0; padding:0;
	text-align: center;
	}
	div, p, table, th, td {
		list-style:none;
		margin:0; padding:0;
		color:#333; font-size:12px;
		font-family:dotum, Verdana, Arial, Helvetica, AppleGothic, sans-serif;
	}
	#testIframe {margin-left: 10px;}
  </style>

<script type="text/javascript" src="ztree.linked/tree.d.js"></script>
<script type="text/javascript" src="ztree.linked/tree.linksort.js"></script>
<script type="text/javascript" src="ztree/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="ztree/js/jquery.ztree.all.min.js"></script>

<script>
	$(document).ready(function(){
		//var t = $("#_tree");
		//t = $.fn.zTree.init(t, setting, treeNodesSample);
		$.fn.zTree.init($("#_tree"), setting, treeNodesSample); 
		//demoIframe = $("#testIframe");
		//demoIframe.bind("load", loadReady);
		var zTree = $.fn.zTree.getZTreeObj("_tree");
		zTree.selectNode(zTree.getNodeByParam("id", 111));

	});

	function sort(){
		$.fn.zTree.init($("#_tree"), setting, mockLinkedListSort(treeNodesSample)); 
		var zTree = $.fn.zTree.getZTreeObj("_tree");
		zTree.selectNode(zTree.getNodeByParam("id", 111));
	}
</script>
 </HEAD>

<BODY>
	<div>
<TABLE border=0 height=600px align=left>
	<TR>
		<TD width=260px align=left valign=top style="BORDER-RIGHT: #999999 1px dashed">
			<ul id="_tree" class="ztree" style="width:260px; overflow:auto;"></ul>
		</TD>
		<TD width=770px align=left valign=top><button width=770px align=left valign=top onclick="sort()">DEMO:按原有顺序排序</button></TD>
	</TR>
</TABLE>
<div>
</BODY>
</HTML>
